<template>
  <div class="app-histroy-audit">
    <search-bar class="container" v-model="queryParams" 
    :search-data="searchData"
    :config="searchData" @search="handleSearch" @searchReset="handleSearchReset" />
    <div class="line"></div>
    <table-page
      :tableData="tableData"
      :tableColumn="tableColumn"
      :isIndex="false"
      :isSelection="false"
      :total="pages.total"
      :pageSize="pages.pageSize"
      :currentPage="pages.pageNum"
      @sizeChange="handleSizeChange"
      @currentChange="handleCurrentChange"
    >
      <template slot="content" slot-scope="{ row }">
        <span class="links" @click="toCustomerDetail(row)">{{ row.content }}</span>
      </template>
    </table-page>
  </div>
</template>

<script>
import { getMessageSate } from '@/api/message'
import SearchBar from '@/components/SearchBar'
import TablePage from '@/components/TablePage'
export default {
  name: 'HistoryAudit',
  components: {
    TablePage,
    SearchBar,
  },
  data: function () {
    return {
      queryParams: {},
      searchData: [
        {
          prop: 'initiator',
         
          placeholder: '发起人',
        },
        {
         
          prop: 'initiationTime',
          type: 'daterange',
          startPlaceholder: '发起时间起',
          endPlaceholder: '发起时间止',
       
        },
        {
        
          prop: 'handleTime',
          type: 'daterange',
          startPlaceholder: '审批时间起',
          endPlaceholder: '审批时间止',
        
        },
       
        {
          prop: 'search',
          type: 'button',
        policy: ['CentralControl.HistoryMessage.query'], 
        }, 
        
      ],
      tableData: [],
      tableColumn: [
        {
          label: '消息标题',
          prop: 'title',
          type: 'yuanText',
          by: 'isRead',
          colors: [
            { color: '#ee3333', value: false },
            { color: '#0acc1e', value: true },
          ],
        },
        {
          label: '消息内容',
          prop: 'content',
          // type: 'linkText',
          render: true,
        },
        {
          label: '发起人',
          prop: 'initiator',
        },
        {
          label: '发起时间',
          prop: 'initiationTime',
        },
        {
          label: '审批时间',
          prop: 'handleTime',
        },
        {
          label: '审批结果',
          prop: 'handleStatus',
          type: 'color',
          colors: [
            { color: 'green', value: true },
            { color: 'red', value: false },
          ],
          dicts: [
            { label: '待处理', value: 0 },
            { label: '处理中', value: 1 },
            { label: '已处理', value: 2 },
            { label: '已取消', value: 3 },
          ],
        },
      ],
      pages: {
        total: 0,
        pageNum: 1,
        pageSize: 10,
      },
    }
  },
  created() {
    this.getTableData()
  },
  methods: {
    getTableData() {
      const params = {
        type: [1],
        isDetails: true,
        SkipCount: ((this.pages.pageNum <= 1 ? 1 : this.pages.pageNum) - 1) * this.pages.pageSize,
        MaxResultCount: this.pages.pageSize,
        ...this.queryParams,
      }
      if (this.queryParams.initiationTime && this.queryParams.initiationTime.length > 0) {
        params.initiationTimeStart = params.initiationTime[0] + ' 00:00:00'
        params.initiationTimeEnd = params.initiationTime[1] + ' 23:59:59'
      }
      if (this.queryParams.handleTime && this.queryParams.handleTime.length > 0) {
        params.handleTimeStart = params.handleTime[0] + ' 00:00:00'
        params.handleTimeEnd = params.handleTime[1] + ' 23:59:59'
      }
      delete params.handleTime
      delete params.initiationTime
      getMessageSate(params).then(res => {
        this.tableData = res.items
        this.pages.total = res.totalCount
      })
    },
    handleSearch() {
      this.pages.pageNum = 1
      this.getTableData()
    },
    handleSearchReset() {
      this.pages.pageNum = 1
      this.getTableData()
    },
    handleSizeChange(v) {
      this.pages.pageSize = v
      this.pages.pageNum = 1
      this.getTableData()
    },
    handleCurrentChange(v) {
      this.pages.pageNum = v
      this.getTableData()
    },
    toCustomerDetail(row) {
      let { noticeBusinessType, dataId } = row
      let { CustomerClueId } = JSON.parse(row.dataOther)
      let array = [6, 7, 8, 9]
      let query = {
        noticeBusinessType,
        dataId,
      }
      if (array.includes(noticeBusinessType)) {
        query.dataId = CustomerClueId
      }
      query.noticeBusinessType = 2
      this.$router.push({
        path: '/customer-app/customer',
        query,
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.container {
  padding: 17px 30px;
  box-sizing: border-box;
}
.line {
  height: 20px;
  background: $app-main-bgc;
}
.links {
  color: #0076ff;
  cursor: pointer;
  &:hover {
    text-decoration: underline;
  }
}
::v-deep .table-page .el-table th:first-child > .cell,
::v-deep .table-page .el-table td:first-child > .cell {
  padding-left: 30px;
}
</style>
